<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/animate.css" />
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/font-awesome.css" />
		<link rel="stylesheet" href="css/style.css" />
	</head>

	<body class="gray-bg">
		<div class="wrapper wrapper-content animated fadeInRight">
			<p class="myEcharts_p">重点人数<span id='zdrAllCount'>0</span>本周更新<span id='zdrAllCount1'>0</span></p>
			<div class="row row-div">
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">投资利益受损群体</div>
							<div class="col-xs-3">
								<img src="./img/tzlysshz.png" />
								<!-- <i class="fa fa-user fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">217</span>
								<!-- <h2 class="font-bold">217</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">涉邪教群体</div>
							<div class="col-xs-3">
								<img src="./img/sxjqt.png" />
								<!-- <i class="fa fa-thumbs-up fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">400</span>
								<!-- <h2 class="font-bold">400</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">严重精神障碍患者</div>
							<div class="col-xs-3">
								<img src="./img/yzjszahz.png" />
								<!-- <i class="fa fa-rss fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">10</span>
								<!-- <h2 class="font-bold">10</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">维稳上访人员</div>
							<div class="col-xs-3">
								<img src="./img/wwsfry.png" />
								<!-- <i class="fa fa-phone fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">120</span>
								<!-- <h2 class="font-bold">120</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">扬言报复社会人员</div>
							<div class="col-xs-3">
								<img src="./img/yybfsh.png" />
								<!-- <i class="fa fa-euro fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">462</span>
								<!-- <h2 class="font-bold">462</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">暴恐危险份子</div>
							<div class="col-xs-3">
								<img src="./img/bkwxfz.png" />
								<!-- <i class="fa fa-shield fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">610</span>
								<!-- <h2 class="font-bold">610</h2> -->
							</div>
						</div>
					</div>
				</div>
				<div class="row-div-w">
					<div class="widget style1 navy-bg">
						<div class="row vertical-align">
							<div class="col-xs-12 dimension">吸毒致幻人员</div>
							<div class="col-xs-3">
								<img src="./img/xdzhry.png" />
								<!-- <i class="fa fa-shield fa-3x"></i> -->
							</div>
							<div class="col-xs-9 text-right">
								<span>总数</span><span class="wd-span">610</span>
								<!-- <h2 class="font-bold">610</h2> -->
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-6">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<h5>重点人分布总揽</h5>
						</div>
						<div class="ibox-content">
							<div class="echarts" id="echarts-pie-chart"></div>
						</div>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<h5>上报部门更新统计</h5>
							<div class="col-sm-2 text-right pull-right" style="font-size:1.5rem;"><span class="week week-sbbm weekActive">周</span>/<span class="month month-sbbm">月</span></div>
						</div>
						<div class="ibox-content">
							<div class="echarts" id="echarts-bar-chart">开发中...</div>
							<div class="echarts" id="echarts-bar-chart2">开发中...这里是月统计</div>
							<!-- <div class="echarts" id="echarts-bar-chart1">开发中...</div> -->
						</div>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-6">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<h5>维度更新统计</h5>
							<div class="col-sm-2 text-right pull-right" style="font-size:1.5rem;"><span class="week week-wd weekActive">周</span>/<span class="month month-wd">月</span></div>
						</div>
						<div class="ibox-content">
							<div class="echarts" id="echarts-bar-chart3">开发中...</div>
							<div class="echarts" id="echarts-bar-chart4">开发中...这里是月统计</div>
							<!-- <div class="echarts" id="echarts-pie-chart1">开发中...</div> -->
						</div>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<h5><span id="tjUpdate" class="span-type selected">类型更新统计</span><span id="tjAdd" class="span-type">类型添加统计</span><span id="tjDelete" class="span-type">类型删除统计</span></h5>
							<div class="col-sm-2 text-right pull-right" style="font-size:1.5rem;"><span class="week week-type weekActive">周</span>/<span class="month month-type">月</span></div>
						</div>
						<div class="ibox-content">
							<div id='chartsUpdate'>
								<div class="echarts" id="echarts-line-chart-week">开发中...</div>
								<div class="echarts" id="echarts-line-chart-month">开发中...</div>
							</div>
							<!-- <div class="echarts" id="echarts-bar-chart1">开发中...</div> -->
							<div id='chartsAdd' style="display: none;">
								<div class="echarts" id="echarts-line-chart-week">开发中...</div>
								<div class="echarts" id="echarts-line-chart-month">开发中...</div>
							</div>
							<div id='chartsDelete' style="display: none;">
								<div class="echarts" id="echarts-line-chart-week">开发中...</div>
								<div class="echarts" id="echarts-line-chart-month">开发中...</div>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="js/common/config.js"></script>
	<script type="text/javascript" src="js/common/utils.js"></script>
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<script type="text/javascript" src="js/echarts/echarts.js"></script>

	<script type="text/javascript" src="js/echarts/echarts-pie-chart.js"></script>
	<!--<script type="text/javascript" src="js/echarts/echarts-pie-chart1.js"></script>-->

	<script type="text/javascript" src="js/echarts/echarts-bar-chart.js"></script>
	<!--<script type="text/javascript" src="js/echarts/echarts-bar-chart1.js"></script>-->
	<script type="text/javascript" src="js/echarts/echarts-bar-chart2.js"></script>
	<script type="text/javascript" src="js/echarts/echarts-bar-chart3.js"></script>
	<script type="text/javascript" src="js/echarts/echarts-bar-chart4.js"></script>

	<script type="text/javascript" src="js/echarts/echarts-line-chart-week.js"></script>
	<script type="text/javascript" src="js/echarts/echarts-line-chart-month.js"></script>

	<script>
		var flag;
		_ajax("g", "api/jp-BIRM-ControlObject-ms/BS/ImportPerson/page", null, (result) => {
			$("#zdrAllCount").html(result.elementsSum);
		}, () => {});
		var now = new Date();
		now.setHours(0);
		now.setMinutes(0);
		now.setSeconds(0);
		now.setMilliseconds(0);
		var nowTime = now.getTime();
		var day = now.getDay();
		var oneDayLong = 24 * 60 * 60 * 1000;
		var MondayTime = 0;
		if(day === 0) {
			day = 7;
			MondayTime = nowTime - (day - 1) * oneDayLong;
		} else {
			MondayTime = nowTime - (day - 1) * oneDayLong;
		}
		var start = new Date(MondayTime).toISOString();
		//		console.log(start);
		var end = new Date().toISOString();
		//		console.log(end);
		_ajax("g", `api/jp-BIRM-ControlObject-ms/BS/ImportPersonInfo/count/updateTime?start=${start}&end=${end}`, null, (result) => {
			$("#zdrAllCount1").html(result);
		}, () => {});
		$("#echarts-line-chart-month").hide();


		$(".month-type").click(function() {
			//			if(flag == 'add'){
			//			alert('add month')
			//			
			//			}else if(flag == 'update'){
			//			alert('update month')
			$(".month-type").addClass("weekActive");
			$(".week-type").removeClass("weekActive");
			$("#echarts-line-chart-month").show();
			$("#echarts-line-chart-week").hide();
			//			}else{
			//				alert('delete month')
			//			}
		})


		$(".week-type").click(function() {
			//			if(flag == 'add') {
			//				alert('add week')
			//
			//			} else if(flag == 'update') {
			//				alert('update week')
			$(".week-type").addClass("weekActive");
			$(".month-type").removeClass("weekActive");
			$("#echarts-line-chart-week").show();
			$("#echarts-line-chart-month").hide();
			//			} else {
			//				alert('delete week')
			//			}

		})
		$("#echarts-bar-chart4").hide();
		$(".month-wd").click(function() {
			$(".month-wd").addClass("weekActive");
			$(".week-wd").removeClass("weekActive");
			$("#echarts-bar-chart4").show();
			$("#echarts-bar-chart3").hide();
		})
		$(".week-wd").click(function() {
			$(".week-wd").addClass("weekActive");
			$(".month-wd").removeClass("weekActive");
			$("#echarts-bar-chart3").show();
			$("#echarts-bar-chart4").hide();
		})

		$("#echarts-bar-chart2").hide();
		$(".month-sbbm").click(function() {
			$(".month-sbbm").addClass("weekActive");
			$(".week-sbbm").removeClass("weekActive");
			$("#echarts-bar-chart2").show();
			$("#echarts-bar-chart").hide();
		})
		$(".week-sbbm").click(function() {
			$(".week-sbbm").addClass("weekActive");
			$(".month-sbbm").removeClass("weekActive");
			$("#echarts-bar-chart").show();
			$("#echarts-bar-chart2").hide();
		})

		//		$("#tjAdd").click(function() {
		//			alert('add')
		//			flag = 'add';
		//			$(".chartsUpdate").hide();
		//			$(".chartsDelete").hide();
		//			$(".chartsAdd ").show();
		//		})
		//		$("#tjUpdate").click(function() {
		//			alert('update')
		//			flag = 'update';
		//			$(".chartsUpdate").show();
		//			$(".chartsDelete").hide();
		//			$(".chartsAdd ").hide();
		//		})
		//		$("#tjDelete").click(function() {
		//			alert('delete')
		//			flag = 'delete';
		//			$(".chartsUpdate").hide();
		//			$(".chartsDelete").show();
		//			$(".chartsAdd ").hide();
		//		})
	</script>

</html>
